<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>我的首页 微博-注册</title>
  <link rel="shortcut icon" href="/static/img/about_UI/favicon.ico" />
  <link rel="bookmark" href="/static/img/about_UI/favicon.ico" type="image/x-icon"/>
  <link rel="stylesheet" href="/static/plugins/bootstrap-3.3.7-dist/css/bootstrap.css">
  <link rel="stylesheet" href="/static/plugins/Font-Awesome-master/css/font-awesome.css">
  <script type="text/javascript" src="/static/js/jquery-3.2.1.js"></script>
  <script type="text/javascript" src="/static/plugins/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
  <style type="text/css">
        *{
            margin: 0;
            padding: 0;
            font-family: "Arial","Microsoft YaHei",serif;

        }
        body{
            background-image: url("/static/img/about_UI/for_register.png");
        }
        .WB_login{
            border: 1px solid rgba(192,192,192,0.5);
            background-color: whitesmoke;
            width: 459px;
            margin: 50px auto ;
            /*padding: 20px;*/
            color: aliceblue;
        }
        .input-group{
            padding-bottom: 13px;
            margin:0 20px;
            /*height: 40px;*/
            /*border-bottom: 1px solid rgba(192,192,192,0.5);*/
        }
        .logo{
            width: 459px;
            height: 90px;
            background-image: url("/static/img/about_UI/WB_logo.png");
            background-repeat: no-repeat;
            background-position: center;
            background-size: 62% 62%;
            /*border: 1px solid red;*/
        }
        .form-control{
            height: 40px;
        }
        .btn,.btn-default{
            margin: 0 auto;
            color: aliceblue;
            background-color: orangered;
            width:415px;
            margin-left: 20px;
        }

  </style>

</head>

<body>
    <div style="width: 1366px;">

        <!-- 此为注册 -->
        <div class="WB_login">
            <div class="logo"></div>
            <div style="width: 459px;text-align: center;color: coral;font-size: 18px;"><span>登陆让我们赶紧更近一步认识你</span></div>

          <!--此为用户名-->
              <div class="input-group">
                <span class="input-group-addon">
                    <i class="fa fa-user fa-fw"></i>
                    <i class="fa fa-user fa-exchange"></i>
                    <i class="fa fa-envelope-o fa-fw"></i>
                </span>
                <input  type="text" class="form-control"  placeholder="Username/用户名 or Email/邮箱" name="username">
              </div>

              <!--此为密码-->
              <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-key fa-fw"></i></span>
                <input  type="password" class="form-control"  placeholder="Password/密码" name="password">
              </div>

              <!--此为图片验证码-->
              <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-check-square fa-fw"></i></span>
                <input type="text"  id="exampleInputCheckCode" class="form-control" style="width: 240px;margin-right: 4px;" placeholder="VerificationCode/验证码" name="email_code">

                <button style="width: 130px;margin-left: 0;height: 40px;">
                    <img src="/check_img_code/" onclick='ReSendCode();' id='imgCode'>
                </button>
              </div>

              <div class="input-group">
                <button style="width: 130px;margin-left: 288px;height: 40px;" class="btn btn-default" onclick="SendCode(this);">使用邮箱验证码</button>
              </div>

              <button onclick="SubmitLogin(this);" class="btn btn-default" style="margin-bottom: 15px;">登陆</button>
            <div style="width:459px;height:40px;text-align:center;line-height:40px;background-color: rgb(246,246,246);">
                <span style="color: #0f0f0f;">没有账号?</span>
                <a  style="text-decoration: none;cursor: pointer;" onclick="Change(this);">注册</a>
            </div>
        </div>


    </div>
    <script type="text/javascript">

        function ReSendCode() {
            var code = document.getElementById('imgCode');
            code.src += '?';
        }

        function Change(ths) {
            // alert("hahaha");
            $.ajax({
                url: "/login/",
                type: "GET",
                data: "",
                success:function(arg) {
                  location.href="/register/";
                }
            })
        }
    </script>




</body>
</html>